 
// -------------------------------------------------------------------
// DHTML Window Widget- By Dynamic Drive, available at: http://www.dynamicdrive.com
// v1.0: Script created Feb 15th, 07'
// v1.01: Feb 21th, 07' (see changelog.txt)
// v1.02: March 26th, 07' (see changelog.txt)
// v1.03: May 5th, 07' (see changelog.txt)
// v1.1:  Oct 29th, 07' (see changelog.txt)
// -------------------------------------------------------------------
  
var yesBtn = "Yes";
var noBtn = "Cancel";

var dhtmlwindow = {
	imagefiles : [ '/HREntry/images/min.gif', '/HREntry/images/close.gif', '/HREntry/images/restore.gif',
			'/HREntry/images/resize.gif' ], //Path to 4 images used by script, in that order
	ajaxbustcache : true, //Bust caching when fetching a file via Ajax?
	ajaxloadinghtml : '<b>&nbsp;&nbsp;Loading...</b>', //HTML to show while window fetches Ajax Content?

	minimizeorder : 0,
	zIndexvalue : 100,
	tobjects : [], //object to contain references to dhtml window divs, for cleanup purposes
	lastactivet : {}, //reference to last active DHTML window

	init : function(t) {
		var domwindow = document.createElement("div") //create dhtml window div
		domwindow.id = t
		domwindow.className = "dhtmlwindow"
		var domwindowdata = ''
		domwindowdata = '<div class="drag-handle">'
		domwindowdata += 'DHTML Window <div class="drag-controls"><img src="'
				+ this.imagefiles[0] + '" title="Minimize"/><img src="'
				+ this.imagefiles[1]
				+ '" title="Close" style="margin-left:1px;"/></div>'
		domwindowdata += '</div>'
		domwindowdata += '<div class="drag-contentarea"></div>'
		domwindowdata += '<div class="drag-statusarea"><div class="drag-resizearea" style="background: transparent url(' + this.imagefiles[3] + ') top right no-repeat;">&nbsp;</div></div>'
		domwindowdata += '</div>'
		domwindow.innerHTML = domwindowdata
		document.getElementById("dhtmlwindowholder").appendChild(domwindow)
		//this.zIndexvalue=(this.zIndexvalue)? this.zIndexvalue+1 : 100 //z-index value for DHTML window: starts at 0, increments whenever a window has focus
		var t = document.getElementById(t)
		var divs = t.getElementsByTagName("div")
		for ( var i = 0; i < divs.length; i++) { //go through divs inside dhtml window and extract all those with class="drag-" prefix
			if (/drag-/.test(divs[i].className))
				t[divs[i].className.replace(/drag-/, "")] = divs[i] //take out the "drag-" prefix for shorter access by name
		}
		//t.style.zIndex=this.zIndexvalue //set z-index of this dhtml window
		t.handle._parent = t //store back reference to dhtml window
		t.resizearea._parent = t //same
		t.controls._parent = t //same
		t.onclose = function() {
			return true
		} //custom event handler "onclose"
		t.onmousedown = function() {
			dhtmlwindow.setfocus(this)
		} //Increase z-index of window when focus is on it
		t.handle.onmousedown = dhtmlwindow.setupdrag //set up drag behavior when mouse down on handle div
		t.resizearea.onmousedown = dhtmlwindow.setupdrag //set up drag behavior when mouse down on resize div
		t.controls.onclick = dhtmlwindow.enablecontrols
		t.show = function() {
			dhtmlwindow.show(this)
		} //public function for showing dhtml window
		t.hide = function() {
			dhtmlwindow.hide(this)
		} //public function for hiding dhtml window
		t.close = function() {
			dhtmlwindow.close(this)
		} //public function for closing dhtml window (also empties DHTML window content)
		t.setSize = function(w, h) {
			dhtmlwindow.setSize(this, w, h)
		} //public function for setting window dimensions
		t.moveTo = function(x, y) {
			dhtmlwindow.moveTo(this, x, y)
		} //public function for moving dhtml window (relative to viewpoint)
		t.isResize = function(bol) {
			dhtmlwindow.isResize(this, bol)
		} //public function for specifying if window is resizable
		t.isScrolling = function(bol) {
			dhtmlwindow.isScrolling(this, bol)
		} //public function for specifying if window content contains scrollbars
		t.load = function(contenttype, contentsource, title) {
			dhtmlwindow.load(this, contenttype, contentsource, title)
		} //public function for loading content into window
		this.tobjects[this.tobjects.length] = t
		return t //return reference to dhtml window div
	},

	open : function(t, contenttype, contentsource, title, attr, recalonload) {
		var d = dhtmlwindow //reference dhtml window object
		function getValue(Name) {
			var config = new RegExp(Name + "=([^,]+)", "i") //get name/value config pair (ie: width=400px,)
			return (config.test(attr)) ? parseInt(RegExp.$1) : 0 //return value portion (int), or 0 (false) if none found
		}

		if (document.getElementById(t) == null) //if window doesn't exist yet, create it
			t = this.init(t) //return reference to dhtml window div
		else
			t = document.getElementById(t)
		this.setfocus(t)
		t.setSize(getValue(("width")), (getValue("height"))) //Set dimensions of window
		var xpos = getValue("center") ? "middle" : getValue("left") //Get x coord of window
		var ypos = getValue("center") ? "middle" : getValue("top") //Get y coord of window
		//t.moveTo(xpos, ypos) //Position window
		if (typeof recalonload != "undefined" && recalonload == "recal"
				&& this.scroll_top == 0) { //reposition window when page fully loads with updated window viewpoints?
			if (window.attachEvent && !window.opera) //In IE, add another 400 milisecs on page load (viewpoint properties may return 0 b4 then)
				this.addEvent(window, function() {
					setTimeout(function() {
						t.moveTo(xpos, ypos)
					}, 400)
				}, "load")
			else
				this.addEvent(window, function() {
					t.moveTo(xpos, ypos)
				}, "load")
		}
		t.isResize(getValue("resize")) //Set whether window is resizable
		t.isScrolling(getValue("scrolling")) //Set whether window should contain scrollbars
		t.style.visibility = "visible"
		t.style.display = "block"
		t.contentarea.style.display = "block"
		t.moveTo(xpos, ypos) //Position window
		t.load(contenttype, contentsource, title)
		if (t.state == "minimized" && t.controls.firstChild.title == "Restore") { //If window exists and is currently minimized?
			t.controls.firstChild
					.setAttribute("src", dhtmlwindow.imagefiles[0]) //Change "restore" icon within window interface to "minimize" icon
			t.controls.firstChild.setAttribute("title", "Minimize")
			t.state = "fullview" //indicate the state of the window as being "fullview"
		}
		return t
	},

	setSize : function(t, w, h) { //set window size (min is 150px wide by 100px tall)
		t.style.width = Math.max(parseInt(w), 150) + "px"
		t.contentarea.style.height = Math.max(parseInt(h), 100) + "px"
	},

	moveTo : function(t, x, y) { //move window. Position includes current viewpoint of document
		this.getviewpoint() //Get current viewpoint numbers
		t.style.left = (x == "middle") ? this.scroll_left
				+ (this.docwidth - t.offsetWidth) / 2 + "px" : this.scroll_left
				+ parseInt(x) + "px"
		t.style.top = (y == "middle") ? this.scroll_top
				+ (this.docheight - t.offsetHeight) / 2 + "px"
				: this.scroll_top + parseInt(y) + "px"
		//t.style.left=(x=="middle")? "100px" : this.scroll_left+parseInt(x)+"px"
		//t.style.top=(y=="middle")? "80px" : this.scroll_top+parseInt(y)+"px"
	},

	isResize : function(t, bol) { //show or hide resize inteface (part of the status bar)
		t.statusarea.style.display = (bol) ? "block" : "none"
		t.resizeBool = (bol) ? 1 : 0
	},

	isScrolling : function(t, bol) { //set whether loaded content contains scrollbars
		t.contentarea.style.overflow = (bol) ? "auto" : "hidden"
	},

	load : function(t, contenttype, contentsource, title) { //loads content into window plus set its title (3 content types: "inline", "iframe", or "ajax")
		if (t.isClosed) {
			alert("DHTML Window has been closed, so no window to load contents into. Open/Create the window again.")
			return
		}
		var contenttype = contenttype.toLowerCase() //convert string to lower case
		if (typeof title != "undefined")
			t.handle.firstChild.nodeValue = title
		if (contenttype == "inline")
			t.contentarea.innerHTML = contentsource
		else if (contenttype == "div") {
			var inlinedivref = document.getElementById(contentsource)
			t.contentarea.innerHTML = (inlinedivref.defaultHTML || inlinedivref.innerHTML) //Populate window with contents of inline div on page
			if (!inlinedivref.defaultHTML)
				inlinedivref.defaultHTML = inlinedivref.innerHTML //save HTML within inline DIV
			inlinedivref.innerHTML = "" //then, remove HTML within inline DIV (to prevent duplicate IDs, NAME attributes etc in contents of DHTML window
			inlinedivref.style.display = "none" //hide that div
		} else if (contenttype == "iframe") {
			t.contentarea.style.overflow = "hidden" //disable window scrollbars, as iframe already contains scrollbars
			if (!t.contentarea.firstChild
					|| t.contentarea.firstChild.tagName != "IFRAME") //If iframe tag doesn't exist already, create it first
				t.contentarea.innerHTML = '<iframe src="" frameborder="0" style="scrollbar-base-color: red;margin:0; padding:0; width:100%; height: 100%" name="_iframe-' + t.id + '"></iframe>'
			window.frames["_iframe-" + t.id].location.replace(contentsource) //set location of iframe window to specified URL
		} else if (contenttype == "ajax") {
			this.ajax_connect(contentsource, t) //populate window with external contents fetched via Ajax
		}
		t.contentarea.datatype = contenttype //store contenttype of current window for future reference
	},

	setupdrag : function(e) {
		var d = dhtmlwindow //reference dhtml window object
		var t = this._parent //reference dhtml window div
		d.etarget = this //remember div mouse is currently held down on ("handle" or "resize" div)
		var e = window.event || e
		d.initmousex = e.clientX //store x position of mouse onmousedown
		d.initmousey = e.clientY
		d.initx = parseInt(t.offsetLeft) //store offset x of window div onmousedown
		d.inity = parseInt(t.offsetTop)
		d.width = parseInt(t.offsetWidth) //store width of window div
		d.contentheight = parseInt(t.contentarea.offsetHeight) //store height of window div's content div
		if (t.contentarea.datatype == "iframe") { //if content of this window div is "iframe"
			t.style.backgroundColor = "#F8F8F8" //colorize and hide content div (while window is being dragged)
			t.contentarea.style.visibility = "hidden"
		}
		document.onmousemove = d.getdistance //get distance travelled by mouse as it moves
		document.onmouseup = function() {
			if (t.contentarea.datatype == "iframe") { //restore color and visibility of content div onmouseup
				t.contentarea.style.backgroundColor = "white"
				t.contentarea.style.visibility = "visible"
			}
			d.stop()
		}
		return false
	},

	getdistance : function(e) {
		var d = dhtmlwindow
		var etarget = d.etarget
		var e = window.event || e
		d.distancex = e.clientX - d.initmousex //horizontal distance travelled relative to starting point
		d.distancey = e.clientY - d.initmousey
		if (etarget.className == "drag-handle") //if target element is "handle" div
			d.move(etarget._parent, e)
		else if (etarget.className == "drag-resizearea") //if target element is "resize" div
			d.resize(etarget._parent, e)
		return false //cancel default dragging behavior
	},

	getviewpoint : function() { //get window viewpoint numbers
		var ie = document.all && !window.opera
		var domclientWidth = document.documentElement
				&& parseInt(document.documentElement.clientWidth) || 100000 //Preliminary doc width in non IE browsers
		this.standardbody = (document.compatMode == "CSS1Compat") ? document.documentElement
				: document.body //create reference to common "body" across doctypes
		this.scroll_top = (ie) ? this.standardbody.scrollTop
				: window.pageYOffset
		this.scroll_left = (ie) ? this.standardbody.scrollLeft
				: window.pageXOffset
		this.docwidth = (ie) ? this.standardbody.clientWidth : (/Safari/i
				.test(navigator.userAgent)) ? window.innerWidth : Math.min(
				domclientWidth, window.innerWidth - 16)
		this.docheight = (ie) ? this.standardbody.clientHeight
				: window.innerHeight
	},

	rememberattrs : function(t) { //remember certain attributes of the window when it's minimized or closed, such as dimensions, position on page
		this.getviewpoint() //Get current window viewpoint numbers
		t.lastx = parseInt((t.style.left || t.offsetLeft))
				- dhtmlwindow.scroll_left //store last known x coord of window just before minimizing
		t.lasty = parseInt((t.style.top || t.offsetTop))
				- dhtmlwindow.scroll_top
		t.lastwidth = parseInt(t.style.width) //store last known width of window just before minimizing/ closing
	},

	move : function(t, e) {
		t.style.left = dhtmlwindow.distancex + dhtmlwindow.initx + "px"
		t.style.top = dhtmlwindow.distancey + dhtmlwindow.inity + "px"
	},

	resize : function(t, e) {
		t.style.width = Math
				.max(dhtmlwindow.width + dhtmlwindow.distancex, 150)
				+ "px"
		t.contentarea.style.height = Math.max(dhtmlwindow.contentheight
				+ dhtmlwindow.distancey, 100)
				+ "px"
	},

	enablecontrols : function(e) {
		var d = dhtmlwindow
		var sourceobj = window.event ? window.event.srcElement : e.target //Get element within "handle" div mouse is currently on (the controls)
	if (/Minimize/i.test(sourceobj.getAttribute("title"))) //if this is the "minimize" control
		d.minimize(sourceobj, this._parent)
	else if (/Restore/i.test(sourceobj.getAttribute("title"))) //if this is the "restore" control
		d.restore(sourceobj, this._parent)
	else if (/Close/i.test(sourceobj.getAttribute("title"))) //if this is the "close" control
		d.close(this._parent)
	return false
},

minimize : function(button, t) {
	dhtmlwindow.rememberattrs(t)
	button.setAttribute("src", dhtmlwindow.imagefiles[2])
	button.setAttribute("title", "Restore")
	t.state = "minimized" //indicate the state of the window as being "minimized"
	t.contentarea.style.display = "none"
	t.statusarea.style.display = "none"
	if (typeof t.minimizeorder == "undefined") { //stack order of minmized window on screen relative to any other minimized windows
		dhtmlwindow.minimizeorder++ //increment order
		t.minimizeorder = dhtmlwindow.minimizeorder
	}
	t.style.left = "10px" //left coord of minmized window
	t.style.width = "400px"
	var windowspacing = t.minimizeorder * 10 //spacing (gap) between each minmized window(s)
	t.style.top = dhtmlwindow.scroll_top + dhtmlwindow.docheight
			- (t.handle.offsetHeight * t.minimizeorder) - windowspacing + "px"
},

restore : function(button, t) {
	dhtmlwindow.getviewpoint()
	button.setAttribute("src", dhtmlwindow.imagefiles[0])
	button.setAttribute("title", "Minimize")
	t.state = "fullview" //indicate the state of the window as being "fullview"
	t.style.display = "block"
	t.contentarea.style.display = "block"
	if (t.resizeBool) //if this window is resizable, enable the resize icon
		t.statusarea.style.display = "block"
	t.style.left = parseInt(t.lastx) + dhtmlwindow.scroll_left + "px" //position window to last known x coord just before minimizing
	t.style.top = parseInt(t.lasty) + dhtmlwindow.scroll_top + "px"
	t.style.width = parseInt(t.lastwidth) + "px"
},

close : function(t) {
	try {
		var closewinbol = t.onclose()
	} catch (err) { //In non IE browsers, all errors are caught, so just run the below
		var closewinbol = true
	} finally { //In IE, not all errors are caught, so check if variable isn't defined in IE in those cases
		if (typeof closewinbol == "undefined") {
			alert("An error has occured somwhere inside your \"onclose\" event handler")
			var closewinbol = true
		}
	}
	if (closewinbol) { //if custom event handler function returns true
		if (t.state != "minimized") //if this window isn't currently minimized
			dhtmlwindow.rememberattrs(t) //remember window's dimensions/position on the page before closing
		if (window.frames["_iframe-" + t.id]) //if this is an IFRAME DHTML window
			window.frames["_iframe-" + t.id].location.replace("about:blank")
		else
			t.contentarea.innerHTML = ""
		t.style.display = "none"
		t.isClosed = true //tell script this window is closed (for detection in t.show())
	}
	return closewinbol
},

setopacity : function(targetobject, value) { //Sets the opacity of targetobject based on the passed in value setting (0 to 1 and in between)
		if (!targetobject)
			return


        if (targetobject.filters && targetobject.filters[0]) { //IE syntax
            if (typeof targetobject.filters[0].opacity == "number") //IE6
                targetobject.filters[0].opacity = value * 100
            else //IE 5.5
                targetobject.style.filter = "alpha(opacity=" + value * 100 + ")"
        }
        else if (typeof targetobject.style.MozOpacity != "undefined") //Old Mozilla syntax
            targetobject.style.MozOpacity = value
        else if (typeof targetobject.style.opacity != "undefined") //Standard opacity syntax
            targetobject.style.opacity = value
    },

    setfocus:function(t) { //Sets focus to the currently active window
        this.zIndexvalue++
        t.style.zIndex = this.zIndexvalue
        t.isClosed = false //tell script this window isn't closed (for detection in t.show())
        this.setopacity(this.lastactivet.handle, 0.5) //unfocus last active window
        this.setopacity(t.handle, 1) //focus currently active window
        this.lastactivet = t //remember last active window
    },


    show:function(t) {
        if (t.isClosed) {
            alert("DHTML Window has been closed, so nothing to show. Open/Create the window again.")
            return
        }
        if (t.lastx) //If there exists previously stored information such as last x position on window attributes (meaning it's been minimized or closed)
            dhtmlwindow.restore(t.controls.firstChild, t) //restore the window using that info
        else
            t.style.display = "block"
        this.setfocus(t)
        t.state = "fullview" //indicate the state of the window as being "fullview"
    },

    hide:function(t) {
        t.style.display = "none"
    },

    ajax_connect:function(url, t) {
        var page_request = false
        var bustcacheparameter = ""
        if (window.XMLHttpRequest) // if Mozilla, IE7, Safari etc
            page_request = new XMLHttpRequest()
        else if (window.ActiveXObject) { // if IE6 or below
            try {
                page_request = new ActiveXObject("Msxml2.XMLHTTP")
            }
            catch (e) {
                try {
                    page_request = new ActiveXObject("Microsoft.XMLHTTP")
                }
                catch (e) {
                }
            }
        }
        else
            return false
        t.contentarea.innerHTML = this.ajaxloadinghtml
        page_request.onreadystatechange = function() {
            dhtmlwindow.ajax_loadpage(page_request, t)
        }
        if (this.ajaxbustcache) //if bust caching of external page
            bustcacheparameter = (url.indexOf("?") != -1) ? "&" + new Date().getTime() : "?" + new Date().getTime()
        page_request.open('GET', url + bustcacheparameter, true)
        page_request.send(null)
    },

    ajax_loadpage:function(page_request, t) {
        if (page_request.readyState == 4 && (page_request.status == 200 || window.location.href.indexOf("http") == -1)) {
            t.contentarea.innerHTML = page_request.responseText
        }
    },


    stop:function() {
        dhtmlwindow.etarget = null //clean up
        document.onmousemove = null
        document.onmouseup = null
    },

    addEvent:function(target, functionref, tasktype) { //assign a function to execute to an event handler (ie: onunload)
        var tasktype = (window.addEventListener) ? tasktype : "on" + tasktype
        if (target.addEventListener)
            target.addEventListener(tasktype, functionref, false)
        else if (target.attachEvent)
            target.attachEvent(tasktype, functionref)
    },

    cleanup:function() {
        for (var i = 0; i < dhtmlwindow.tobjects.length; i++) {
            dhtmlwindow.tobjects[i].handle._parent = dhtmlwindow.tobjects[i].resizearea._parent = dhtmlwindow.tobjects[i].controls._parent = null
        }
        window.onload = null
    }

} //End dhtmlwindow object

document.write('<div id="dhtmlwindowholder"><span style="display:none">.</span></div>') //container that holds all dhtml window divs on page
window.onunload = dhtmlwindow.cleanup


// -------------------------------------------------------------------
// DHTML Modal window- By Dynamic Drive, available at: http://www.dynamicdrive.com
// v1.0: Script created Feb 27th, 07'
// v1.01 May 5th, 07' Minor change to modal window positioning behavior (not a bug fix)
// v1.1: April 16th, 08' Brings it in sync with DHTML Window widget. See changelog.txt for the later for changes.
// REQUIRES: DHTML Window Widget (v1.01 or higher): http://www.dynamicdrive.com/dynamicindex8/dhtmlwindow/
// -------------------------------------------------------------------

if (typeof dhtmlwindow == "undefined")
    alert('ERROR: Modal Window script requires all files from "DHTML Window widget" in order to work!')

var dhtmlmodal = {
    veilstack: 0,
    open:function(t, contenttype, contentsource, title, attr, recalonload) {
        var d = dhtmlwindow //reference dhtmlwindow object
        this.interVeil = document.getElementById("interVeil") //Reference "veil" div
        this.veilstack++ //var to keep track of how many modal windows are open right now
        this.loadveil()
        if (recalonload == "recal" && d.scroll_top == 0)
            d.addEvent(window, function() {
                dhtmlmodal.adjustveil()
            }, "load")
        var t = d.open(t, contenttype, contentsource, title, attr, recalonload)
        t.controls.firstChild.style.display = "none" //Disable "minimize" button
        t.controls.onclick = function() {
            dhtmlmodal.close(this._parent, true)
        } //OVERWRITE default control action with new one
        t.show = function() {
            dhtmlmodal.show(this)
        } //OVERWRITE default t.show() method with new one
        t.hide = function() {
            dhtmlmodal.close(this)
        } //OVERWRITE default t.hide() method with new one
        return t
    },


    loadveil:function() {
        var d = dhtmlwindow
        d.getviewpoint()
        this.docheightcomplete = (d.standardbody.offsetHeight > d.standardbody.scrollHeight) ? d.standardbody.offsetHeight : d.standardbody.scrollHeight
        this.interVeil.style.width = d.docwidth + "px" //set up veil over page
        this.interVeil.style.height = this.docheightcomplete + "px" //set up veil over page
        this.interVeil.style.left = 0 //Position veil over page
        this.interVeil.style.top = 0 //Position veil over page
        this.interVeil.style.visibility = "visible" //Show veil over page
        this.interVeil.style.display = "block" //Show veil over page
    },

    adjustveil:function() { //function to adjust veil when window is resized
        if (this.interVeil && this.interVeil.style.display == "block") //If veil is currently visible on the screen
            this.loadveil() //readjust veil
    },

    closeveil:function() { //function to close veil
        this.veilstack--
        if (this.veilstack == 0) //if this is the only modal window visible on the screen, and being closed
            this.interVeil.style.display = "none"
    },


    close:function(t, forceclose) { //DHTML modal close function
        t.contentDoc = (t.contentarea.datatype == "iframe") ? window.frames["_iframe-" + t.id].document : t.contentarea //return reference to modal window DIV (or document object in the case of iframe
        if (typeof forceclose != "undefined")
            t.onclose = function() {
                return true
            }
        if (dhtmlwindow.close(t)) //if close() returns true
            this.closeveil()
    },


    show:function(t) {
        dhtmlmodal.veilstack++
        dhtmlmodal.loadveil()
        dhtmlwindow.show(t)
    }
} //END object declaration


document.write('<div id="interVeil"></div>')
dhtmlwindow.addEvent(window, function() {
    if (typeof dhtmlmodal != "undefined") dhtmlmodal.adjustveil()
}, "resize")


//custom define function
function openWindow(id, location, title) {
    window['dw' + id] = dhtmlwindow.open('dw' + id, 'iframe', location, title, 'width=778px,height=550px,center=1')
}
function openPopup(location, title, width, height) {
    window['dw'] = dhtmlwindow.open('dw', 'iframe', location, title, 'width=' + width + ',height=' + height + ',center=1')
}
/* search modal */
function confirmExit() {
    exitmodal = dhtmlmodal.open('exit', 'div', 'exitdiv', 'Thoát khỏi ứng dụng?', 'width=300px,height=150px,center=1,resize=0,scrolling=0')
}

/*------------*/
/*------------*/

function ExpandCollapse(image, index, col) {

    // get the source of the image

    var src = image.getAttribute("src");

    // if src is currently "icon-expand.png", then toggle it to "icon-collapse.png"

    if (src.indexOf("expand") > 0) {
        //  toggle the  image
        image.src = src.replace("expand", "collapse");
        // Get a reference to the current row where the image is

        var tr = image.parentNode.parentNode;
        // Get a reference to the next row from where the image is

        var next_tr = tr.nextSibling;
        // Get a refernece to the <tbody> tag of the grid
        var tbody = tr.parentNode;
        // Get a reference to the image's column
        var td = image.parentNode;
        var detailnode

        //loop through the content of the image's column. if hidden div is found, get a reference
        for (var j = 0; j < td.childNodes.length; j++) {
            if (td.childNodes[j].nodeType == 1) {
                if (td.childNodes[j].nodeName.toLowerCase() == 'div') {
                    detailnode = td.childNodes[j].cloneNode(true);
                    detailnode.setAttribute('style', 'background-color: #CCFFCC;');
                }
            }
        }

        // Create a new table row for "Expand"   
        var newtr = document.createElement('tr');
        var newtd = document.createElement('td');
        var newfirsttd = newtd.cloneNode(true);
        /* insert an empty cell first */
        // var newempttd = document.creatElement('td');
        // newempttd.innerHTML= "&nbsp;";
        newfirsttd.innerHTML = '&nbsp;';
        newtr.appendChild(newfirsttd);

        newtd.colSpan = col;
        newtd.setAttribute('style', 'padding: 0;	margin: 0; background-color: #FFFFCC;');

        // insert the  hidden div's content  into the new row
        newtd.innerHTML = detailnode.innerHTML;
        newtr.appendChild(newtd);

        tbody.insertBefore(newtr, next_tr);
        tr.className = "selected";

    }
    else {
        image.src = src.replace("collapse", "expand");
        var row = image.parentNode.parentNode;
        var rowsibiling = row.nextSibling;
        var rowparent = row.parentNode;

        rowparent.removeChild(rowsibiling);

        if (index % 2 == 0) {
            row.className = "normal";
        }
        else {
            row.className = "alternate";
        }
    }
}

/************************************

 Custom Alert Demonstration
 version 1.0
 last revision: 02.02.2005
 steve@slayeroffice.com

 Should you improve upon this source please
 let me know so that I can update the version
 hosted at slayeroffice.

 Please leave this notice in tact!

 ************************************/

d = document;

ie = document.all && !window.opera;
domclientWidth = document.documentElement && parseInt(document.documentElement.clientWidth) || 100000;//Preliminary doc width in non IE browsers
standardbody = (document.compatMode == "CSS1Compat") ? document.documentElement : document.body; //create reference to common "body" across doctypes
scroll_top = (ie) ? standardbody.scrollTop : window.pageYOffset;
scroll_left = (ie) ? standardbody.scrollLeft : window.pageXOffset;
docwidth = (ie) ? standardbody.clientWidth : (/Safari/i.test(navigator.userAgent)) ? window.innerWidth : Math.min(domclientWidth, window.innerWidth - 16);
docheight = (ie) ? standardbody.clientHeight : window.innerHeight;
 

function alertbox(txt) {

    if (d.getElementById("modalContainer")) return;

    mObj = d.getElementsByTagName("body")[0].appendChild(d.createElement("div"));
    mObj.id = "modalContainer";
    mObj.style.height = d.documentElement.scrollHeight + "px";

    alertObj = mObj.appendChild(d.createElement("div"));
    alertObj.id = "alertBox";

    alertObj.style.left = scroll_left + (docwidth - alertObj.offsetWidth) / 2 + "px";
    alertObj.style.top = scroll_top + (docheight - alertObj.offsetHeight * 2) / 2 + "px";
    alertObj.style.visiblity = "visible";

    h1 = alertObj.appendChild(d.createElement("h1"));
    h1.appendChild(d.createTextNode("Alert!"));

    msg = alertObj.appendChild(d.createElement("p"));
    msg.innerHTML = txt;

    btn = alertObj.appendChild(d.createElement("div"));
    btn.id = "divbtn";

    yesbtn = d.createElement("input");
    yesbtn.type = "button";
    yesbtn.setAttribute('class', 'sbutton');
    yesbtn.value = "OK";
    yesbtn.onclick = function() {
        removebox();
        return false;
    }
    btn.appendChild(yesbtn); 
    alertObj.style.display = "block";
    return false;
}

function removebox(val) {
    document.getElementsByTagName("body")[0].removeChild(document.getElementById("modalContainer"));
}

var returnfunc;

function confirmbox(txt, func) {

    if (d.getElementById("modalContainer")) return;

    mObj = d.getElementsByTagName("body")[0].appendChild(d.createElement("div"));
    mObj.id = "modalContainer";
    mObj.style.height = d.documentElement.scrollHeight + "px";

    alertObj = mObj.appendChild(d.createElement("div"));
    alertObj.id = "alertBox";
    //
    alertObj.style.left = scroll_left + (docwidth - alertObj.offsetWidth) / 2 + "px";
    alertObj.style.top = scroll_top + (docheight - alertObj.offsetHeight * 2) / 2 + "px";
    alertObj.style.visiblity = "visible";
   
    h1 = alertObj.appendChild(d.createElement("h1"));
    h1.appendChild(d.createTextNode("Confirm box!"));
    
    msg = alertObj.appendChild(d.createElement("p"));
    msg.innerHTML = txt;

    btn = alertObj.appendChild(d.createElement("div"));
    btn.id = "divbtn";

    yesbtn = d.createElement("input");
    yesbtn.type = "button";
    yesbtn.setAttribute('class', 'sbutton');
    yesbtn.value = yesBtn;
    yesbtn.onclick = function() {
        returnval(true);
    }
    btn.appendChild(yesbtn);

    nobtn = d.createElement("input");
    nobtn.type = "button";
    nobtn.setAttribute('class', 'sbutton');
    nobtn.value = noBtn;
    
    nobtn.onclick = function() {
        returnval(false);
    }
    btn.appendChild(nobtn);

    alertObj.style.display = "block";
    returnfunc = func; 
    return false;
}

function returnval(val) {
    document.getElementsByTagName("body")[0].removeChild(document.getElementById("modalContainer"));
    returnfunc(val);
}


// IE5.5+ PNG Alpha Fix v2.0 Alpha: Background Tiling Support
// (c) 2008-2009 Angus Turnbull http://www.twinhelix.com

// This is licensed under the GNU LGPL, version 2.1 or later.
// For details, see: http://creativecommons.org/licenses/LGPL/2.1/

var IEPNGFix = window.IEPNGFix || {};

IEPNGFix.tileBG = function(elm, pngSrc, ready) {
    // Params: A reference to a DOM element, the PNG src file pathname, and a
    // hidden "ready-to-run" passed when called back after image preloading.

    var data = this.data[elm.uniqueID],
            elmW = Math.max(elm.clientWidth, elm.scrollWidth),
            elmH = Math.max(elm.clientHeight, elm.scrollHeight),
            bgX = elm.currentStyle.backgroundPositionX,
            bgY = elm.currentStyle.backgroundPositionY,
            bgR = elm.currentStyle.backgroundRepeat;

    // Cache of DIVs created per element, and image preloader/data.
    if (!data.tiles) {
        data.tiles = {
            elm: elm,
            src: '',
            cache: [],
            img: new Image(),
            old: {}
        };
    }
    var tiles = data.tiles,
            pngW = tiles.img.width,
            pngH = tiles.img.height;

    if (pngSrc) {
        if (!ready && pngSrc != tiles.src) {
            // New image? Preload it with a callback to detect dimensions.
            tiles.img.onload = function() {
                this.onload = null;
                IEPNGFix.tileBG(elm, pngSrc, 1);
            };
            return tiles.img.src = pngSrc;
        }
    } else {
        // No image?
        if (tiles.src) ready = 1;
        pngW = pngH = 0;
    }
    tiles.src = pngSrc;

    if (!ready && elmW == tiles.old.w && elmH == tiles.old.h &&
            bgX == tiles.old.x && bgY == tiles.old.y && bgR == tiles.old.r) {
        return;
    }

    // Convert English and percentage positions to pixels.
    var pos = {
        top: '0%',
        left: '0%',
        center: '50%',
        bottom: '100%',
        right: '100%'
    },
            x,
            y,
            pc;
    x = pos[bgX] || bgX;
    y = pos[bgY] || bgY;
    if (pc = x.match(/(\d+)%/)) {
        x = Math.round((elmW - pngW) * (parseInt(pc[1]) / 100));
    }
    if (pc = y.match(/(\d+)%/)) {
        y = Math.round((elmH - pngH) * (parseInt(pc[1]) / 100));
    }
    x = parseInt(x);
    y = parseInt(y);

    // Handle backgroundRepeat.
    var repeatX = { 'repeat': 1, 'repeat-x': 1 }[bgR],
            repeatY = { 'repeat': 1, 'repeat-y': 1 }[bgR];
    if (repeatX) {
        x %= pngW;
        if (x > 0) x -= pngW;
    }
    if (repeatY) {
        y %= pngH;
        if (y > 0) y -= pngH;
    }

    // Go!
    this.hook.enabled = 0;
    if (!({ relative: 1, absolute: 1 }[elm.currentStyle.position])) {
        elm.style.position = 'relative';
    }
    var count = 0,
            xPos,
            maxX = repeatX ? elmW : x + 0.1,
            yPos,
            maxY = repeatY ? elmH : y + 0.1,
            d,
            s,
            isNew;
    if (pngW && pngH) {
        for (xPos = x; xPos < maxX; xPos += pngW) {
            for (yPos = y; yPos < maxY; yPos += pngH) {
                isNew = 0;
                if (!tiles.cache[count]) {
                    tiles.cache[count] = document.createElement('div');
                    isNew = 1;
                }
                var clipR = Math.max(0, xPos + pngW > elmW ? elmW - xPos : pngW),
                        clipB = Math.max(0, yPos + pngH > elmH ? elmH - yPos : pngH);
                d = tiles.cache[count];
                s = d.style;
                s.behavior = 'none';
                s.left = (xPos - parseInt(elm.currentStyle.paddingLeft)) + 'px';
                s.top = yPos + 'px';
                s.width = clipR + 'px';
                s.height = clipB + 'px';
                s.clip = 'rect(' +
                        (yPos < 0 ? 0 - yPos : 0) + 'px,' +
                        clipR + 'px,' +
                        clipB + 'px,' +
                        (xPos < 0 ? 0 - xPos : 0) + 'px)';
                s.display = 'block';
                if (isNew) {
                    s.position = 'absolute';
                    s.zIndex = -999;
                    if (elm.firstChild) {
                        elm.insertBefore(d, elm.firstChild);
                    } else {
                        elm.appendChild(d);
                    }
                }
                this.fix(d, pngSrc, 0);
                count++;
            }
        }
    }
    while (count < tiles.cache.length) {
        this.fix(tiles.cache[count], '', 0);
        tiles.cache[count++].style.display = 'none';
    }

    this.hook.enabled = 1;

    // Cache so updates are infrequent.
    tiles.old = {
        w: elmW,
        h: elmH,
        x: bgX,
        y: bgY,
        r: bgR
    };
};


IEPNGFix.update = function() {
    // Update all PNG backgrounds.
    for (var i in IEPNGFix.data) {
        var t = IEPNGFix.data[i].tiles;
        if (t && t.elm && t.src) {
            IEPNGFix.tileBG(t.elm, t.src);
        }
    }
};
IEPNGFix.update.timer = 0;

if (window.attachEvent && !window.opera) {
    window.attachEvent('onresize', function() {
        clearTimeout(IEPNGFix.update.timer);
        IEPNGFix.update.timer = setTimeout(IEPNGFix.update, 100);
    });
}

/* add remove item listbox*/

function addOption(theSel, theText, theValue) {
    var newOpt = new Option(theText, theValue);
    var selLength = theSel.length;
    theSel.options[selLength] = newOpt;
}
function deleteOption(theSel) {
    var selLength = theSel.length;
    for (i = selLength - 1; i >= 0; i--) {
        theSel.options[i] = null;
    }
}
function selAll() {
    elem = document.getElementById('listSelectedServices');
    varr = new Array();
    for (d = 0; d < elem.length; d++) {
        varr[d] = elem.options[d].value;
    }
    vars = varr.join(",");
    tmps = document.getElementById('services');
    tmps.value = vars;
}


function moveOptions(SFrom, STo) {
    var theSelFrom = document.getElementById(SFrom);
    var theSelTo = document.getElementById(STo);
    var selLength = theSelFrom.length;
    var selectedText = new Array();
    var selectedValues = new Array();
    var selectedCount = 0;
    var i;
    for (i = selLength - 1; i >= 0; i--) {
        if (theSelFrom.options[i].selected) {
            selectedText[selectedCount] = theSelFrom.options[i].text;
            selectedValues[selectedCount] = theSelFrom.options[i].value;
            selectedCount++;
        }
    }
    deleteOption(theSelTo);
    for (i = selectedCount - 1; i >= 0; i--) {
        addOption(theSelTo, selectedText[i], selectedValues[i]);
    }
    selAll();
}
function swapOpt(shift, STo) {
    elem = document.getElementById(STo);
    ind = elem.selectedIndex;
    if (ind != -1) {
        if (ind == 0 && shift == -1) {
            return false;
        }
        if (ind == elem.length - 1 && shift == 1) {
            return false;
        }
        nind = ind + shift;
        tval = elem.options[nind].value;
        ttxt = elem.options[nind].text;
        elem.options[nind].value = elem.options[ind].value;
        elem.options[nind].text = elem.options[ind].text;
        elem.options[ind].value = tval;
        elem.options[ind].text = ttxt;
        elem.selectedIndex = nind;
        selAll();
    }
}

function loadOptions(SFrom, STo) {
    var theSelFrom = document.getElementById(SFrom);
    var theSelTo = document.getElementById(STo);
    var tmps = document.getElementById('services').value;
    var arr = tmps.split(",");
    for (var i = 0; i < theSelFrom.length; i++) {
        for (var j = 0; j < arr.length; j++) {
            if (theSelFrom.options[i].value == arr[j]) {
                addOption(theSelTo, theSelFrom.options[i].text, theSelFrom.options[i].value);
                /*deleteOption(theSelFrom, i);*/
            }
        }
    }
}

/* One check boxes */

function checkBoxValidate(cb, chLength) {
    for (i = 0; i < chLength; i++) {
        if (eval("document.forms[0].mobileOperators[" + i + "].checked") == true) {
            document.forms[0].mobileOperators[i].checked = false;
            if (i == cb) {
                document.forms[0].mobileOperators[i].checked = true;
            }
        }
    }
}
  
function post(formName, params) {
	var postForm = document.forms[formName];
	var ps = params.split(":");
	if (1 == (ps.length % 2))
		return;
	var param;
	for (i = 0; i < ps.length / 2; i++) {
		param = document.createElement("input");
		param.type = "hidden";
		param.name = ps[2 * i];
		param.value = encodeURI(ps[2 * i + 1]);
		postForm.appendChild(param);
	}
	postForm.submit();
}


function confirmButton(params, txt) { 
	return confirmbox(txt ,
            function(ret) {
                if (ret) { 
                	var postForm = document.forms[0];
                	var ps = params.split("&");  
                	for (i = 0; ps != null && i < ps.length; i++) {
                		var tmp = ps[i].split("=");
                		if(tmp != null && tmp.length == 2){
	                		var param = document.createElement("input");
	                		param.type = "hidden";
	                		param.name = tmp[0];
	                		param.value = encodeURI(tmp[1]);
	                		postForm.appendChild(param);
                		}
                	}
                	postForm.submit();
                }
            }
      );
} 

function confirmHref(params, txt) { 
	confirmbox(txt ,
            function(ret) {
                if (ret) { 
                	var postForm = document.forms[0];
                	var ps = params.split("&");  
                	for (i = 0; ps != null && i < ps.length; i++) {
                		var tmp = ps[i].split("=");
                		if(tmp != null && tmp.length == 2){
	                		var param = document.createElement("input");
	                		param.type = "hidden";
	                		param.name = tmp[0];
	                		param.value = encodeURI(tmp[1]);
	                		postForm.appendChild(param);
                		}
                	}
                	postForm.submit();
                }
            }
      );
}

function confirmHref2(url, txt) { 
	confirmbox(txt ,
            function(ret) { 
		 		if(ret){
		 			 var urlParams = url.split('?', 10); 
					 var submitForm = document.createElement("FORM");
					 document.body.appendChild(submitForm);
					 submitForm.method = "POST";
					 if(urlParams.length >= 2){ 
						 var indexes = urlParams[1].split('&', 1000); 
						 for(var i = 0; i < indexes.length; i ++){
							 var tmp = indexes[i].split('=', 10); 
							 var param = document.createElement("input");
	                		 param.type = "hidden";
	                		 param.name = tmp[0];
	                	     param.value = tmp[1];
							 submitForm.appendChild(param);
						 } 
					 }
					 submitForm.action= urlParams[0];
					 submitForm.submit();
		 		}
            }
      );
}
 
 

function doSubmit(params){
	alert(params);
  pagingParamAndValue=params.substring(1,params.indexOf('&'));
  pagingParamAndValueArr = pagingParamAndValue.split('=');
  htmlStr = "<input type='hidden' name='" + pagingParamAndValueArr[0] + "' value='" + pagingParamAndValueArr[1] + "'>";
  var ps = document.getElementById('pagingSpan');
  ps.innerHTML=htmlStr;
  document.forms[0].submit();
}
  

function changeSortOrder(e, form) {
	var key = e.keyCode || e.which;
	if (key == 13) {
		form.sortParam.value = 1;
		form.submit();
	}
}
 

function viewResponse(val) {
    document.forms[0].type.value = 2;
    document.forms[0].phoneNumber.value = val;
    document.forms[0].submit();
}

function viewDetailCode(val) {
    document.forms[0].exportExcel.value = 'false';
    document.forms[0].exportServiceId.value = '0';
    document.forms[0].type.value = 1;
    document.forms[0].serviceId.value = val;
    document.forms[0].submit();
}


function doExport(val) {
    document.forms[0].exportExcel.value = val;
    document.forms[0].submit();
}

function doExport4ServiceId(val) {
    document.forms[0].exportServiceId.value = val;
    document.forms[0].submit();
}

function resetFormExport(){
    document.forms[0].exportExcel.value = 'false';
    document.forms[0].exportServiceId.value = '0';
    doChange();
}

function formatCurrency(num) {
    num = num.toString().replace(/\$|\,/g, '');
    if (isNaN(num))
        num = "0";
    sign = (num == (num = Math.abs(num)));
    num = Math.floor(num * 100 + 0.50000000001);
    cents = num % 100;
    num = Math.floor(num / 100).toString(); 
    for (var i = 0; i < Math.floor((num.length - (1 + i)) / 3); i++)
        num = num.substring(0, num.length - (4 * i + 3)) + ',' +
                num.substring(num.length - (4 * i + 3)); 
    return (((sign) ? '' : '-') + num);
}
 